<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="./js/echarts.min.js"></script>
    <script src="./js/jquery-3.6.0.min.js"></script>
    <title>天气分析数据可视化大屏</title>
    <link rel="stylesheet" href="./css/keshihua.css">
</head>

<body>
    <div class="container">
        <div class="left">
            <div class="left-top" id="weather">
                <div class="weather-day"><img src="./icons/100.svg" alt="晴" class="weather-icon-svg">
                    <p class="temp-max">000</p>
                    <p class="weather-desc">测试1</p>
                </div>
                <div class="weather-day"><img src="./icons/104.svg" alt="阴" class="weather-icon-svg">
                    <p class="temp-max">000</p>
                    <p class="weather-desc">测试2</p>
                </div>
            </div>
            <div class="blank"></div>
            <div class="left-middle" id='temperature'></div>
            <div class="blank"></div>
            <div class="left-bottom" id="humidity"></div>
        </div>
        <div class="blank"></div>
        <div class="middle">
            <div class="middle-top">
                <h1>天气分析可视化大屏</h1>
            </div>
            <div class='middle-box1'>
                <p id="average-max-temp">七日平均最高气温：</p>
                <p id="average-min-temp">七日平均最低气温：</p>
            </div>
            <div class="middle-box2">
                <div class='middle-box2-1' id="change-background">
                    <p>切换背景</p>
                </div>
                <div class='middle-box2-2' id="update-data">
                    <p>更新数据</p>
                </div>
            </div>
        </div>
        <div class="blank"></div>
        <div class="right">
            <div class="right-top" id="ultraviolet"></div>
            <div class="blank"></div>
            <div class="right-middle" id="airQuality"></div>
            <div class="blank"></div>
            <div class="right-bottom" id="rainFall"></div>
        </div>
    </div>
</body>
<script src="./js/keshihua.js"></script>

</html>

</html>